<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>用户列表</title>
		<META HTTP-EQUIV="pragma" CONTENT="no-cache">
		<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
		<META HTTP-EQUIV="expires" CONTENT="0">
		<link rel="stylesheet" href="https://unpkg.com/element-ui@2.0.5/lib/theme-chalk/index.css">
		<script src="https://unpkg.com/vue/dist/vue.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vue"></script>
		<script src="http://cdn.bootcss.com/vue-resource/1.3.4/vue-resource.js"></script>
		<script src="https://unpkg.com/element-ui@2.0.5/lib/index.js"></script>
		<script src="../../../js/dyConfig.js"></script>
		
		
		<link rel="stylesheet" href="../../../css/elementui-index.css">
		<!-- 必须先引入vue  后使用element-ui -->
		<script src="../../../js/vue@2.6.12.js"></script>
		<script src="../../../js/elementui-index.js"></script>
		<script src="../../../js/jquery-3.3.1.min.js"></script>
		<script src="../../../js/dyConfig.js"></script>
		<script src="../../../js/dyPublic.js"></script>
		<script src="../../../js/md5.js"></script>
		<script src="../../../lib/layer/layer.js"></script>
		<script src="../../../layui/layui.js"></script>
		<script src="../../../lib/web/web.js"></script>
		<style type="text/css">
			.el-form{
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				/* margin: 0 30px; */
			}
		</style>
	</head>
	<body>
		<div id="app">
			<el-form :inline="true" class="demo-form-inline">
			
			        <el-form-item label="用户名称">
			            <el-input v-model="userQuery.name" placeholder="用户名称"/>
			        </el-form-item>
			        <el-form-item label="添加时间">
			            <el-date-picker
			                v-model="userQuery.begin"
			                type="datetime"
			                placeholder="选择开始时间"
			                value-format="yyyy-MM-dd HH:mm:ss"
			                default-time="00:00:00"
			            />
			        </el-form-item>
			
			        <el-form-item>
			            <el-date-picker
			                v-model="userQuery.end"
			                type="datetime"
			                placeholder="选择截止时间"
			                value-format="yyyy-MM-dd HH:mm:ss"
			                default-time="00:00:00"
			            />
			        </el-form-item>
					<el-form-item>
					  <el-button type="primary" @click="userInfo()">查询</el-button>
					  <!-- resetData() -->
					  <el-button type="primary" @click="flush()">刷新</el-button>
					  
					  <el-button type="primary" @click="handleadd('')" style="color:white" >添加</el-button>
					</el-form-item>
			
			    
			
			    </el-form>

			<!-- 展示表格-->
			<el-table
				ref="testTable"
				:data="tableData"
				style="width:100%"
				border>
				<el-table-column type="index" :index="indexMethod" label="序号" align="center" width="60"></el-table-column>
				<el-table-column prop="userName" label="姓名" align="center" ></el-table-column>
				<el-table-column prop="userCode" label="账号" align="center" ></el-table-column>
				<el-table-column prop="roles" label="角色" align="center" ></el-table-column>
				<el-table-column prop="phone" label="手机号" align="center" ></el-table-column>
				<el-table-column prop="createTime" label="创建时间" align="center" ></el-table-column>
				<!-- <el-table-column label="是否启用" min-width="160">
					<template slot-scope="scope">
						{{scope.row.locked==0?'已启用':'未启用'}}
					</template>
				</el-table-column> -->
				<el-table-column label="操作" width="200px" align="center">
					<template slot-scope="scope">
						<router-link :to="'/teacher/edit/'+scope.row.id">
							<el-button type="primary" size="mini" icon="el-icon-edit" @click="updateUserById(scope.row.id)">修改</el-button>
						</router-link>
						<el-button type="danger" size="mini" icon="el-icon-delete" @click="removeDataById(scope.row.id)">删除</el-button>
					</template>
				</el-table-column>
			</el-table>
			<!-- 分页 -->
			<el-pagination
				:current-page="page"
				:page-size="limit"
				:total="total"
				style="padding: 30px 0; text-align: center;"
				layout="total, prev, pager, next, jumper"
				@current-change="userInfo"
				
			/>
		</div>
	</body>
	<script src="./userList.js"></script>
</html>
